<!-- 个人中心账号设置 -->
<extend name="Base/common" />
<block name="body">
    <div class="wrapper-sm padd clear">
        <!--用户 -->
        <div class="self-side-l fl">
            {$selfHtml}
            <div class="self-hot-con">
                <include file="Template/hot" />
            </div>
        </div>
        <!-- 账号设置 -->
        <div class="self-side-content fr">
            <div class="code-setup box">
                <h2 class="fs-20 padd-lr v-align"> <i class="icon icon-self-info mar-r5"></i> <span>个人资料</span></h2>
            </div>
            <div class="code-item-setup mar-t20 box">
                <form class="div-form" action="{:U('User/avatar')}">
                    <div class="code-change-setup code-setup feedback-setup">
                        <h2 class="bor-bott1 v-align"><span>个性化设置</span><a class="fr js-edit-pass btn-sure btn-primary btn-lg  mar-t10 mar-r10" href="javascript:;">编辑</a><button class="fr btn-sure btn-primary btn-lg btn-submit mar-t10 mar-r10" style="display:none" type="submit">提交</button></h2>
                    </div>
                    <div class="toggler-target">
                        <!-- 头像和背景图上传 地址{:U('User/avatar')} -->
                        <div class="code-change-pass">
                            <div class="code-change-diy clear padd">
                                <div class="code-diy-preview fl">
                                    <h3 class="">预览效果</h3>
                                    <div class="cover code-diy-cover box l-align">
                                        <div class="self-avator-bg">
                                            <div class="self-avator-img format-cover" data-filltype="full">
                                                <img class="lazy-img" data-src="{$user.background|default="__ROOT__/Public/Home/images/background.jpg"}" alt="">
                                            </div>
                                            <div class="padd-tb10 self-avator-positon">
                                                <div class="self-avartor box-radius format-cover" data-filltype="full">
                                                    <img class="lazy-img" data-src="{$user.avatar|default="__ROOT__/Public/Home/images/avatar.jpg"}" alt="{$user.nickname}">
                                                </div>
                                                <div class="recommend-follow in-block mar-tb10">
                                                    <div class="btn btn-self-name">{$user.nickname}</div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="code-change-file fr">
                                    <h3>上传头像</h3>
                                    <p class="padd-tb fs-14">选择本地图片，上传编辑自己的头像。</p>
                                    <div class="code-file-trans clear">
                                        <div class="code-file-btn active fl">
                                            <input type="file" class="btn-upload js-ul-avatar " name="download">
                                            <input type="hidden" name="avatar" id="file-avatar" value="">
                                        </div>
                                        <div class="code-file-format fr">
                                            <span class="fc-grayer">支持jpg、jpeg、png、bmp格式的图片。</span>
                                        </div>
                                    </div>
                                    <h3 class="mar-t20">上传背景图</h3>
                                    <p class="padd-tb fs-14">选择本地图片，上传编辑自己的背景图片</p>
                                    <div class="code-file-trans clear">
                                        <div class="code-file-btn active fl">
                                            <input type="file" class="btn-upload js-ul-bg" name="download">
                                            <input type="hidden" name="background" id="file-bg" value="">
                                        </div>
                                        <div class="code-file-format fr">
                                            <span class="fc-grayer">支持jpg、jpeg、png、bmp格式的图片。</span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="code-change-mess self-detail_text">您可以在此修改您的头像以及背景图片，请注意支持格式<br>请将图片大小控制在500K以内.</div>
                    </div>
                </form>
            </div>
            <div class="code-item-setup mar-t20 box">
                <form action="{:U('Ucenter/setProfile')}" method="POST" class="profile-form">
                    <div class="code-change-setup code-setup feedback-setup">
                        <h2 class="bor-bott1 v-align"><span>基本信息</span><a class="fr js-edit-info btn-sure btn-primary btn-lg  mar-t10 mar-r10" href="javascript:;">编辑</a><button class="fr btn-sure btn-primary btn-lg btn-submit mar-t10 mar-r10" style="display:none" type="submit">提交</button></h2>
                    </div>
                    <div class="self-introduce" style="display: block">
                        <div class="self-feedback padd10 clear">
                            <div class="fl self-feedback-text v-align"><i class="icon icon-other-index mar-r10"></i><span>个人简介</span></div>
                            <div class="self-feedback-input">
                                <textarea class="self-intro" name="desc" id="textarea" disabled="true">{$profile.desc}</textarea>
                            </div>
                        </div>
                        <div class="self-feedback padd10 clear">
                            <div class="fl self-feedback-text v-align"><i class="icon icon-other-basic mar-r10"></i><span>擅长游戏</span></div>
                            <div class="self-feedback-input">
                                <ul>
                                    <volist name="profile.game" id="game">
                                        <li><input name="game[]" type="text" class="disabled" value="{$game}" readonly="readonly" UNSELECTABLE='on'><a class="close-input" href="javascript:;"></a></li>
                                    </volist>
                                    <li class="self-feedback-show"><a href="javascript:;" class="new-add">新增+</a></li>
                                </ul>
                            </div>
                        </div>
                        <div class="self-feedback padd10 clear">
                            <div class="fl self-feedback-text v-align"><i class="icon icon-other-genter mar-r10"></i><span>性别</span></div>
                            <div class="self-feedback-input">
                                <select name="gender" id="gender" disabled>
                                    <option value="男" <eq name="profile.gender" value="男">selected</eq>>男</option>
                                    <option value="女" <eq name="profile.gender" value="女">selected</eq>>女</option>
                                    <option value="保密" <eq name="profile.gender" value="保密">selected</eq>>保密</option>
                                </select>
                            </div>
                        </div>
                        <div class="self-feedback padd10 clear">
                            <div class="fl self-feedback-text v-align"><i class="icon icon-other-age mar-r10"></i><span>年龄</span></div>
                            <div class="self-feedback-input">
                                <select name="age" id="age" disabled="true">
                                    <volist name="ages" id="age">
                                        <option value="{$age}" <eq name="profile.age" value="$age"> selected </eq>>{$age}</option>
                                    </volist>
                                </select>
                            </div>
                        </div>
                        <div class="self-feedback padd10 clear">
                            <div class="fl self-feedback-text v-align"><i class="icon icon-other-constellation mar-r10"></i><span>星座</span></div>
                            <div class="self-feedback-input">
                                <select name="stars" id="st" disabled="true">
                                    <volist name="stars" id="st">
                                        <option value="{$st}" <eq name="profile.stars" value="$st"> selected </eq>>{$st}</option>
                                    </volist>
                                </select>
                            </div>
                        </div>
                        <div class="self-feedback padd10 clear">
                            <div class="fl self-feedback-text v-align"><i class="icon icon-other-hobby mar-r10"></i><span>兴趣爱好</span></div>
                            <div class="self-feedback-input">
                                <input class="self-win" name="interest" id="textarea" value="{$profile.interest}" disabled="true">
                            </div>
                        </div>
                        <div class="self-feedback padd10 clear">
                            <div class="fl self-feedback-text v-align"><i class="icon icon-other-resister mar-r10"></i><span>注册时间</span></div>
                            <div class="self-feedback-input">
                                <input class="self-time-input" id="textarea" value="{$profile.reg_time|date=" Y-m-d ", ###}" disabled="true">
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</block>
<block name="script">
    <script type="text/javascript">
    $(function() {
        return $(".toggler").click(function() {
            var s = $(this);
            return s.next(".toggler-target").stop().slideToggle(), s.find(".padd-lr").text(s.find(".padd-lr").text().indexOf('收') > -1 ? '展开' : '收起');
        }), $(".icon-delete").click(function() {
            return $(this).prev('input').val('').focus();
        });
    });
    </script>
</block>